@import "bootstrap/scss/functions";

$body-bg: #14141a;
$body-color: #c1c9e4;

$font-family-sans-serif: "Work Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
$link-color: $body-color;
$list-group-bg: transparent;


$blue:    #449fbe;
$purple:  #5C398F;
$pink:    #B53D6D;
$red:     #D35D47;
$orange:  #fd7e14;
$yellow:  #D38F47;
$green:   #87C041;
$teal:    #20c997;
$cyan:    #0dcaf0;

$primary: $blue;
$secondary: #748d95;
$light: transparent;
$info: $blue;


$component-active-bg: $primary;

$input-bg: #1c1c24;
$input-border-color: #ced4da40;
$input-color: #ccc;
$input-focus-bg: #1b1b22;
$input-focus-border-color: tint-color($component-active-bg, 25%) ;
$input-disabled-bg: $input-bg;

$input-btn-focus-color-opacity: .25;
$input-btn-border-width: 2px;

$border-color: rgba(#fff, .125);

$list-group-color: $body-color;
$list-group-border-color: $border-color;
$list-group-hover-bg: rgba(#fff, .0625);
$list-group-action-color: $body-color;
$list-group-action-hover-color: $body-color;
$list-group-action-active-color: $body-color;
$list-group-action-active-bg: rgba(#fff, .125);

$link-hover-color: lighten($link-color, 25%);

$badge-color: $body-bg;

$text-muted: rgba($body-color, .5);

$modal-content-bg: $body-bg;

$btn-close-color: $secondary;
$btn-link-disabled-color: rgba(255, 255, 255, .5);
$btn-disabled-color: #969696;

$alert-bg-scale: 100%;
$alert-border-scale: 50%;
$alert-color-scale: 0%;

$code-color: #84f1fe;

$form-check-input-border: 2px solid $input-border-color;
$form-switch-color: $secondary;
$form-check-color: $primary;

@import "bootstrap/scss/variables";
@import "./vars.common.scss";

$link-underline-color: rgba($link-color, .5);
$link-hover-underline-color: rgba($link-hover-color, .75);



$form-check-input-width: 1.3em;
$form-switch-width: 2.5em;
$form-switch-padding-start:       3em;

$form-check-input-checked-border-color:   shade-color($form-check-color, $btn-active-border-shade-amount);
$form-check-input-checked-bg-color:       shade-color($form-check-color, $btn-active-bg-shade-amount);

$primary-bg-subtle:       shade-color($primary, 80%);
$secondary-bg-subtle:     shade-color($secondary, 80%);
$success-bg-subtle:       shade-color($success, 80%);
$info-bg-subtle:          shade-color($info, 80%);
$warning-bg-subtle:       shade-color($warning, 80%);
$danger-bg-subtle:        shade-color($danger, 80%);

$primary-text-emphasis:   tint-color($primary, 60%);
$secondary-text-emphasis: tint-color($secondary, 60%);
$success-text-emphasis:   tint-color($success, 60%);
$info-text-emphasis:      tint-color($info, 60%);
$warning-text-emphasis:   tint-color($warning, 60%);
$danger-text-emphasis:    tint-color($danger, 60%);
